<template>
  <div>
    <p>{{ msg }}</p>
    <p>{{ msg | reverse("+") }}</p>
    <p :title="msg | reverse | toUpper">Hover Here</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      msg: "Hello, Vue",
    };
  },
  filters: {
    reverse(val, char) {
      return val.split("").reverse().join(char);
    },
  },
};
</script>

<style>
</style>